<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
   /* 
        函数封装概念:
        函数就是把完成特定功能的一段代码抽象出来，使之成为程序中的一个独立实体，起个名字（函数名）。可以在同一个程序或其他程序中多次重复使用（通过函数名调用）。
    

        函数封装的步骤:
        1. 要对封装的代码/功能足够熟悉(先完成特定功能的代码)
        2. 将完成特定功能的代码抽离出来, 放到函数中,并起一个函数名
        3. 把可变参数提取为形式参数(可以理解为也是一个变量)  => 形式参数是函数内和函数外交流的唯一入口 (可以接收函数调用时传入的实际值) 
        4. 确定函数的返回值 => 函数执行完毕之后返回的结果
        5. 如何调用函数?    
            函数名()

        关于形参(形式参数)和实参(实际参数)
        形参(形式参数):  形式参数是函数内和函数外交流的唯一入口 => 可以理解成是一个变量(存储数据),用于接收函数调用时传入的实际值
        实参(实际参数):  实际参数函数调用时实际传入的值 
        形参和实参一一对应

        关于函数的返回值
            (1) 返回值表示函数执行完毕之后返回的结果 => 可以由用户自行决定(根据需求)
            (2) 如果不设置返回值, 函数默认返回undefined (此处缺少一个值)
            (3) 返回值表示函数执行完毕之后返回的结果(函数的唯一出口) => 一个函数只能设置一个返回值, 表示函数执行完毕 => 位于return之后的语句不执行

        关于函数调用：
            (1) 对应函数名调用函数,如果函数不调用,函数中的代码不执行
            (2) 每次调用函数都会执行函数中的上下文 (从函数function对应的{}中的第一行 一直执行到最后一行)

   
   */


    // 需求:封装一个函数sum => 可以计算两数之和 sum(1,2) => 3
    

    //  1. 要对封装的代码/功能足够熟悉(先完成特定功能的代码)
    // var a = 1;
    // var b = 2;
    // var c = a + b;
    // console.log(c);

    // 2. 将完成特定功能的代码抽离出来, 放到函数中,并起一个函数名

    // debugger;

    /* function sum(){
        // console.log("函数开始执行")
        var a = 1;
        var b = 2;
        var c = a + b; // 3
        // console.log(c);  // 3

        // 4. 确定函数的返回值  => 函数执行完毕后返回的结果
        return c; // 3
        // return "hello"; // "hello"

        alert(3333);  // 位于return之后的语句不执行 
    }*/


    // 当前问题: 函数中的变量a和b的值一直都是定死的 => 函数的返回值也是定死的(3)

    // 3. 把可变参数提取为形式参数(可以理解为也是一个变量)  => 形式参数是函数内和函数外交流的唯一入口 (可以接收函数调用时传入的实际值) 

    debugger;

    function sum(a,b){ // 形式参数
        console.log("形参接收的数据",a,b)

        // 需求: 不期望 a b是定死的值 => 而是根据用户传入的值来计算
        // var a = 1;
        // var b = 2;


        var c = a + b; // 3

        // 4. 确定函数的返回值  => 函数执行完毕后返回的结果
        return c; // 3
    }

    // 5. 调用函数  => 函数名()
    var res = sum(10,20); 
    console.log(res);

    var res1 = sum(11,22);
    console.log(res1);





    // var result = Boolean(100);
    // console.log(result);  // true






</script>
</html>